<template>
  <div>
    <el-carousel height="400px">
<!--      <el-carousel-item v-for="item in banner_list" :key="item.id">-->
<!--        &lt;!&ndash;        router-link只能跳内部，不能跳外部&ndash;&gt;-->

<!--&lt;!&ndash;        <router-link :to="item.link" v-if="item.link.indexOf('http:')<0">&ndash;&gt;-->
<!--&lt;!&ndash;          <img :src="item.image" :alt="item.title">&ndash;&gt;-->
<!--&lt;!&ndash;        </router-link>&ndash;&gt;-->
<!--&lt;!&ndash;        <a :href="item.link" v-else>&ndash;&gt;-->
<!--&lt;!&ndash;          <img :src="item.image" :alt="item.title">&ndash;&gt;-->
<!--&lt;!&ndash;        </a>&ndash;&gt;-->

<!--      </el-carousel-item>-->
      <el-carousel-item v-for="item in list" :key="item">
      <img :src="item.img" style="margin-right: 1000px">
    </el-carousel-item>
    </el-carousel>
  </div>
</template>

<script>
export default {
  name: "Banner",
  data() {
    return {
      banner_list: [{image: 'https://img1.baidu.com/it/u=1123086522,2759330676&fm=253&fmt=auto&app=138&f=JPEG?w=1280&h=333'}],
      list:[
      {img: 'https://img2.baidu.com/it/u=972002618,175165241&fm=253&fmt=auto&app=138&f=PNG?w=1901&h=500'},
      {img: 'https://img0.baidu.com/it/u=2500523304,557939730&fm=253&fmt=auto&app=138&f=JPEG?w=1901&h=500'},
      {img: 'https://img0.baidu.com/it/u=3133549008,1303382843&fm=253&fmt=auto&app=138&f=JPEG?w=1920&h=500'},

    ],
    }
  },
  // created() {
  //   this.$axios.get(`${this.$settings.BASE_URL}home/banner/`).then(res => {
  //     this.banner_list = res.data.data
  //   })
  // }
}
</script>

<style scoped>
.el-carousel__item h3 {
  color: #475669;
  /*font-size: 18px;*/
  /*opacity: 0.75;*/
  /*line-height: 300px;*/
  /*margin: 0;*/
}


/*.el-carousel__item {*/
/*  height: 400px;*/
/*  min-width: 1000px;*/
/*}*/

/*.el-carousel__item img {*/
/*  height: 400px;*/
/*  margin-left: calc(50% - 1920px / 2);*/
/*  !*margin-right: 0px;*!*/
/*}*/
</style>